/*------------------------------------------------------------------------
# CrowdFind - FEB 11, 2014
# ------------------------------------------------------------------------
# Designed by MegaDrupal & HTML by MegaDrupal
# Websites:  http://www.megadrupal.com -  Email: info@megadrupal.com
--------------------------------------------------------------------------

	1.	Reset
    2.	Grid System
    3.	Common css (Link, button, margin class, text align class...)
    4.	Layout extend
    5.	Navigation
    6.	Icons
    7.	Pagination
    8.	Form
    9.	Project item, Project update item
    10.	Header
    11.	Footer
    12.	Module's style
    13.	Page's style

--------------------------------------------------------------------------------*/

/* 1.	Reset
--------------------------------------------------------------------------------*/
html{
    font-size: 100%;
    -ms-text-size-adjust: 100%;
    -webkit-text-size-adjust: 100%;
}
body{
    background: #FFFFFF;
    margin: 0;
    font-family: "Roboto", sans-serif;
    font-size: 0.813em;/*13px*/
    line-height: 1.6em;
    color: #333333;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}
.rs{
    margin: 0;
    padding: 0;
}
ul.rs, ol.rs{
    list-style: none;
}

img{
    /* Responsive images (ensure images don't scale beyond their parents) */
    max-width: 100%;
    /* Part 1: Set a maxium relative to the parent */
    /*width: auto\9; */
    /* IE7-8 need help adjusting responsive images */
    height: auto;
    /* Part 2: Scale the height according to the width, otherwise you get stretching */
    vertical-align: middle;
    border: 0;
    -ms-interpolation-mode: bicubic;
}
button, input, select, textarea{
    margin: 0;
    vertical-align: middle;
    font-family: inherit;
    font-size: 100%;
    outline: none;
}
button, input{
    *overflow: visible;
    line-height: normal;
}
button::-moz-focus-inner,
input::-moz-focus-inner{
    padding: 0 !important;
    margin: 0  !important;
    border: 0 !important;
}
button, html input[type="button"], input[type="reset"], input[type="submit"]{
    -webkit-appearance: button;
    cursor: pointer;
}
label, select, button,
input[type="button"],
input[type="reset"],
input[type="submit"],
input[type="radio"],
input[type="checkbox"]{
    cursor: pointer;
}
input[type="search"]{
    box-sizing: content-box;
    -moz-box-sizing: content-box;
    -webkit-box-sizing: content-box;
    -webkit-appearance: textfield;
}
input[type="search"]::-webkit-search-decoration,
input[type="search"]::-webkit-search-cancel-button{
    -webkit-appearance: none;
}
::-webkit-input-placeholder {color: #BABABA;}
:-moz-placeholder {color: #BABABA;}/* Firefox 18- */
::-moz-placeholder {color: #BABABA;} /* Firefox 19+ */
:-ms-input-placeholder {color: #BABABA;}

textarea{
    overflow: auto;
    vertical-align: top;
    resize: none;
}
/* reset design */
h1, h2, h3, h4, h5, h6{
    font-weight: normal;
    color: #000000;
    line-height: 1.2em;
}
h1{font-size: 3.0769em}
h2{font-size: 2.3077em}
h3{font-size: 1.8462em}
h4{font-size: 1.3846em}
h5{font-size: 1.0769em}
h6{font-size: 0.9231em}

::-moz-selection { background: #0B2C3C; color: #04D9D9; text-shadow: none; }
::selection { background: #0B2C3C; color: #04D9D9; text-shadow: none; }
/*
::-webkit-scrollbar {width: 12px; height: 12px; }
::-webkit-scrollbar-track {background: #F2F2F2;border: solid #D8D8D8;border-width: 0 1px;}
::-webkit-scrollbar-thumb {background: #333333;-webkit-box-shadow: inset 1px 1px 2px rgba(155, 155, 155, 0.4);}
::-webkit-scrollbar-thumb:hover {-webkit-box-shadow: inset 1px 1px 10px rgba(0,0,0,0.3);}
::-webkit-scrollbar-thumb:active {background: #DD5B43;-webkit-box-shadow: inset 1px 1px 2px rgba(0,0,0,0.3);}
*/

/* 2. Grid System (http://960.gs/)
--------------------------------------------------------------------------------*/
.grid_frame{
    max-width: 1200px;
    margin-left: auto;
    margin-right: auto;
}
.container_grid{
    width: 100%;
}
.grid_1,
.grid_2,
.grid_3,
.grid_4,
.grid_5,
.grid_6,
.grid_7,
.grid_8,
.grid_9,
.grid_10,
.grid_11,
.grid_12{
    display: inline;
    float: left;
    margin-left: 1.25%;
    margin-right: 1.25%;
}

.grid_1{width: 5.833333333333333%;}
.grid_2{width: 14.166666666666666%;}
.grid_3{width: 22.5%;}
.grid_4{width: 30.833333333333336%;}
.grid_5{width: 39.166666666666664%;}
.grid_6{width: 47.5%;}
.grid_7{width: 55.833333333333336%;}
.grid_8{width: 64.16666666666667%;}
.grid_9{width: 72.5%;}
.grid_10{width: 80.83333333333333%;}
.grid_11{width: 89.16666666666667%;}
.grid_12{width: 97.5%;}

.make-left{float: left}
.make-right{float: right}
.margin-unit{margin-left: 15px;margin-right: 15px}

#wrapper{
    margin: 0 auto;
    /*max-width: 1920px;*/
}
.clearfix{
    *zoom: 1;
}
.clearfix:before,
.clearfix:after{
    display: table;
    content: "";
    line-height: 0;
}
.clearfix:after{
    clear: both;
}
.clear{
	background: none;
	border: 0;
	clear: both;
	display: block;
	float: none;
	font-size: 0;
	list-style: none;
	margin: 0;
	padding: 0;
	overflow: hidden;
	visibility: hidden;
	width: 0;
	height: 0;
}
.row-clear{
    clear: both;
}

/* 3.	Common css
--------------------------------------------------------------------------------*/
.dis-scroll{overflow: hidden;}
.hide-elem{display: none}
.ta-l{text-align: left}
.ta-c{text-align: center}
.ta-r{text-align: right}
.fs-i{font-style: italic}
.fw-n{font-weight: normal}
.cl-trans{
    transition:color 0.3s;
    -o-transition:color 0.3s;
    -ms-transition:color 0.3s;
    -moz-transition:color 0.3s;
    -webkit-transition:color 0.3s;
}
a{
	color: #333333;
	text-decoration: none;
}
a:hover{text-decoration: underline;}
a:hover, a:active{outline: 0;}
a.be-green:hover{color: #04D9D9;text-decoration: none}
.fc-green{color: #04D9D9}
.br2{
    border-radius: 2px;
    -moz-border-radius: 2px;
    -webkit-border-radius: 2px;
}
.dp-inline-block{
    display: inline-block;
    *display: inline;
    *zoom: 1;
}

/**** Button ****/
.btn{
    display: inline-block;
    border: none;
    text-align: center;
    color: #ffffff;
    font-size: 0.9230769230769231em;
    text-transform: uppercase;;
    line-height: normal;
    border-radius: 5px;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    transition: background 0.3s, border-color 0.3s;
    -o-transition: background 0.3s, border-color 0.3s;
    -ms-transition: background 0.3s, border-color 0.3s;
    -moz-transition: background 0.3s, border-color 0.3s;
    -webkit-transition: background 0.3s, border-color 0.3s;
}
.btn:hover{
    text-decoration: none;
}
.btn-category{
    padding: 8px 17px 9px 17px;
     font-size: 1.076923076923077em;
}
.btn-category.btn-all{
    background: #04D9D9;
}



/* 4.	Layout extend
--------------------------------------------------------------------------------*/

/* 2 Columns ()*/
.layout-2cols{}
.layout-2cols > .content{}
.layout-2cols > .sidebar{}

.flex,
.flex-body {
  overflow: hidden;
  *overflow: visible;
  zoom: 1;
}
.flex > .thumb-left{
    float: left;
    margin-right:14px;
}
.block{}
.block .title h3{
    color: #262626;
    font-size: 2.46154em;
    margin: 0;
    padding-bottom: 35px;
    display: inline-block;
    font-weight: 700;
}
.block .title .more{
    float: right;
    margin-top: 12px;
    color: #666666;
    text-transform: uppercase;
    text-decoration: underline;
}
.block .title .more:hover{
    color: #04D9D9;
}
.block .block-content{}


/* 5.	Navigation
--------------------------------------------------------------------------------*/
.main-nav .nav-item{
    float: left;
    border-right: 1px solid #333333;
    box-sizing: border-box;
    min-width: 120px;
    cursor: pointer;
    padding: 14px 0 15px 11px;
    position: relative;
}
.main-nav .nav-item:first-child{
    border-left: 1px solid #333333;
}
.main-nav .nav-item.has-sub:hover{
    background: #ffffff;
}
.main-nav .nav-link{
    color: #ffffff;
    display: block;
}
.main-nav .nav-link:hover{
    color: #04D9D9;
}
.main-nav .nav-item.has-sub:hover .nav-link,
.main-nav .nav-item.has-sub .nav-link:hover{
    color: #0A0608;
}
.main-nav .nav-title{
    text-transform: uppercase;
    font-size: 1.2308em;
    line-height: 1em;
}
.main-nav a:hover{
    text-decoration: none;
}
.main-nav .nav-description{
    display: block;
    line-height: 1em;
    margin-top: -2px;
}

/* 6.	Sprites
--------------------------------------------------------------------------------*/
.icon{background: transparent url("../images/icon.png?v=0.0121989") no-repeat;border: none;line-height:0;display: inline-block;*display: inline;*zoom: 1;}
    .iUser          {width:20px;height:18px;background-position: 0 0}
    .iUser2         {width:16px;height:14px;background-position: -40px 0}
    .iUser3         {width:24px;height:16px;background-position: -56px 0}
    .iBell          {width:14px;height:16px;background-position: -104px 0}
    .iLocation      {width:09px;height:16px;background-position: -132px 0}
    .iUncheck1      {width:15px;height:15px;background-position: -176px 0}
    .iUncheck2      {width:14px;height:14px;background-position: -209px 0}
    .iMagnifier     {width:14px;height:14px;background-position: -273px 0}
    .iClose         {width:13px;height:13px;background-position: -373px 0;cursor: pointer;}
    .iClose-b       {width:15px;height:15px;background-position: -386px 0;cursor: pointer;}

    /*row2*/
    .iFb-Sq         {width:24px;height:24px;background-position: -108px -19px}
    .iTw-Sq         {width:24px;height:24px;background-position: -132px -19px}
    .iGG-Sq         {width:25px;height:24px;background-position: -156px -19px}
    .iTw            {width:24px;height:21px;background-position: -181px -19px}
    .iGG            {width:25px;height:21px;background-position: -205px -19px}
    .iPin           {width:18px;height:24px;background-position: -230px -19px}
    .iFb            {width:11px;height:24px;background-position: -248px -19px}
    .iTw-s          {width:18px;height:15px;background-position: -259px -19px}
    .iGG-s          {width:18px;height:16px;background-position: -277px -19px}
    .iPin-s         {width:14px;height:18px;background-position: -295px -19px}
    .iFb-s          {width:09px;height:18px;background-position: -309px -19px}

    /*row3*/
    .iArrowNext-1   {width:17px;height:34px;background-position: 0 -47px}
    .iArrowPrev-2   {width:12px;height:22px;background-position: -17px -47px}
    .iArrowNext-2   {width:12px;height:22px;background-position: -29px -47px}
    .iArrowPrev-3   {width:06px;height:12px;background-position: -65px -47px}
    .iArrowNext-3   {width:06px;height:12px;background-position: -71px -47px}
    .iArrowDown-4   {width:12px;height:07px;background-position: -77px -47px}

    /*.iUser:hover,.iUser.active{background-position: -20px 0}*/
    /*.iUser2:hover,.iUser2.active{background-position: -64px 0}*/
    /*.iBell:hover,.iBell.active{background-position: -102px 0}*/
    /*.iLocation:hover,.iLocation.active{background-position: -125px 0}*/
    .iMagnifier:hover,.iMagnifier.active{background-position: -287px 0}

/* 7.	Pagination
--------------------------------------------------------------------------------*/
.pagination{
    text-align: center;
}

/* 8.	Form
--------------------------------------------------------------------------------*/
.form{}
.form .txt{
    background: #FFFFFF;
    border: 1px solid #ffffff;
    padding: 6px 10px;
    margin: 0;
    border-radius: 3px;
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
    box-shadow: 0 0 3px rgba(0, 0, 0, 0.05);
    -moz-box-shadow: 0 0 3px rgba(0, 0, 0, 0.05);
    -webkit-box-shadow: 0 0 3px rgba(0, 0, 0, 0.05);
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    transition: border 0.3s;
    -o-transition: border 0.3s;
    -ms-transition: border 0.3s;
    -moz-transition: border 0.3s;
    -webkit-transition: border 0.3s;
}
.form .txt:focus{
    border-color: #04D9D9;
}
.form-search{
    float: right;
    position: relative;
}
.form-search .txt-keyword{
    color: #ffffff;
    margin: 0;
    padding: 0 30px 0 12px;
    width: 180px;
    height: 24px;
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    display: inline-block;
    outline: 0;
    background-color: #111111;
    border: 1px solid #333333;
    border-radius: 24px;
    -moz-border-radius: 24px;
    -webkit-border-radius: 24px;
    box-shadow: inset 0 0 0 rgba(0, 0, 0, 0);
    -moz-box-shadow: inset 0 0 0 rgba(0, 0, 0, 0);
    -webkit-box-shadow: inset 0 0 0 rgba(0, 0, 0, 0);
    transition: border linear 0.2s, box-shadow linear 0.2s;
    -o-transition: border linear 0.2s, -o-box-shadow linear 0.2s;
    -moz-transition: border linear 0.2s, -moz-box-shadow linear 0.2s;
    -webkit-transition: border linear 0.2s, -webkit-box-shadow linear 0.2s;
    *display: inline;
    *zoom: 1;
    vertical-align: middle;
}
.form-search .txt-keyword:focus{
    border-color:#04D9D9;
    /* IE6-9 */
    box-shadow:0 0 8px rgba(120, 231, 104, 0.6);
    -moz-box-shadow: 0 0 8px rgba(120, 231, 104, 0.6);
    -webkit-box-shadow: 0 0 8px rgba(120, 231, 104, 0.6);
}
.form-search .btn-search{
    position: absolute;
    top:4px;
    right:8px;
    width: 16px;
    height: 16px;
    border: none;
    padding: 0;
    margin: 0;
    background: none;
    line-height: 0;
}


/* 9.	Project item
--------------------------------------------------------------------------------*/
.project-item{}
.project-item .project-content{
    background: #FFFFFF;
    border: 1px solid #DDDDDD;
    border-radius: 5px;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    box-shadow: 0 0 3px rgba(0,0,0,.05);
    -moz-box-shadow: 0 0 3px rgba(0,0,0,.05);
    -webkit-box-shadow: 0 0 3px rgba(0,0,0,.05);
}
.project-item .thumb-img{
    display: block;
    line-height: 0;
}
.project-item .thumb-img img{
    width: 100%;
    border-radius: 5px 5px 0 0;
    -moz-border-radius: 5px 5px 0 0;
    -webkit-border-radius: 5px 5px 0 0;
}
.project-item .wrap-maincontent{
    padding: 15px;
    position: relative;
}
.project-item .icon-cate{
    position: absolute;
    top: -14px;
    left: 15px;
}
.project-item .wrap-short-detail{
    padding: 32px 0 0 0;
    height: 158px;
    margin-bottom: 10px;
    overflow: hidden;
}
.project-item .acticle-title{
    font-weight: 700;
    font-size: 1.23077em;
    line-height: 1.2em;
    padding-bottom: 3px;
}
.project-item .acticle-title a:hover{
    text-decoration: none;
    color: #04D9D9;
}
.project-item .tiny-desc,
.project-item .tiny-desc a{
    color: #bababa;
}
.project-item .title-description{
    padding-top: 5px;
}
.project-item .line-progress{
    padding-bottom: 15px;
}
.project-item .bg-progress{
    overflow: hidden;
    background: #EEEEEE;
    height: 6px;
}
.project-item .bg-progress > span{
    display: block;
    height: 100px;
    background: #04D9D9;
}
.project-item .group-fee{
    padding: 0;
}
.project-item .group-fee .fee-item{
    float: left;
    padding: 0 0 0 0;
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
}
.project-item .group-fee .fee-item.funded,
.project-item .group-fee .fee-item.dayleft{
    width: 29.16667%;
}
.project-item .group-fee .fee-item.funded{
    padding-left: 10px;
}
.project-item .group-fee .fee-item.pledged{
    width: 37.4%;
    border: solid #DADFE1;
    border-width: 0 1px;
    padding: 0 0 0 12px;
    margin-right: 4.2%;
}
.project-item .group-fee .lbl{
    text-transform: uppercase;
    line-height: 0.8em;
    /*font-size: 0.76923em;*/
    font-size: 0.92308em;
}
.project-item .group-fee .val{
    font-weight: 700;
}
/*highlight*/
.project-item.highlight{ }
.project-item.highlight .project-content{
    background: #0B2C3C;
    color: #FFFFFF;
}
.project-item.highlight .acticle-title a{
    color: #04D9D9;
}
.project-item.highlight .acticle-title a:hover{
    text-decoration: underline;
}
.project-item.highlight .tiny-desc,
.project-item.highlight .tiny-desc a{
    color: #b9b9b9;
}
.project-item.highlight .bg-progress{
    background: #1F4C73;
}


/* 9.	Project update item
--------------------------------------------------------------------------------*/
.project-update-item{
    background: #eeeeee;
    color: #262626;
    margin-bottom: 30px;
}
.project-update-item > .thumb-left{
    margin-right: 18px;
}
.project-update-item .right-item{
    position: relative;
    padding-bottom: 30px;
}
.project-update-item .top-info{
    overflow: hidden;
    height: 105px;
    padding-top: 12px;
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
}
.project-update-item .update-order{
    font-size: 1.84615em;
    display: inline-block;
    line-height: 1.2em;
}
.project-update-item .desc-update{
    padding-top: 5px;
    font-weight: bold;
    font-size: 1.23077em;
}
.project-update-item .view-detail{
    font-size: 1.07692em;
    color: #262626;
    position: absolute;
    bottom: 7px;
    left: 0;
}
/*highlight*/
.project-update-item.highlight{
    background: #0B2C3C;
    color: #04D9D9;
}
.project-update-item.highlight .view-detail{
    color: #ffffff;
}
.project-update-item.highlight .view-detail:hover{
    text-decoration: underline;
}


/* 9.	Project feature item
--------------------------------------------------------------------------------*/
.project-feature-item{
    background: #EEEEEE;
    position: relative;
}
.project-feature-item .stick-lbl{
    position: absolute;
    top: 20px;
    left: -7px;
    background: #0B2C3C;
    color: #04D9D9;
    font-size: 0.92308em;
    height: 22px;
    line-height: 20px;
    padding: 0 15px;
    box-shadow: 0 2px rgba(0,0,0,0.1);
}
.project-feature-item .stick-lbl:before,
.project-feature-item .stick-lbl:after{
    content: "";
    position: absolute;
    left: 100%;
    top: 0;
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 11px 8px 0 0;
    border-color: #0b2c3c transparent transparent transparent;
}
.project-feature-item .stick-lbl:after{
    top: 11px;
    border-width: 11px 0 0 8px;
    border-color: transparent transparent transparent #0b2c3c;
    box-shadow: 0 2px rgba(0,0,0,0.1);
}
.project-feature-item .feature-img{
    float: left;
    width: 69.07216%;
    margin-right: 3.09278%;
    border: 1px solid #eeeeee;
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
}
.project-feature-item .project-info{
    float: left;
    position: relative;
    padding-bottom: 100px;
    width: 24.74227%;
}
.project-feature-item .wrap-top-info{
    height: 77px;
    padding-top: 12px;
}
.project-feature-item .project-title{
    font-weight: 700;
    padding: 0 0 5px 0;
    line-height: 1em;
}
.project-feature-item .project-title a{
    color: #04D9D9;
}
.project-feature-item .author{
    color: #131313;
    padding-bottom: 20px;
}
.project-feature-item .desc{
    color: #262626;
    height: 120px;
    overflow: hidden;
}
.project-feature-item .bottom-info{
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
}
.project-feature-item .project-price{
    border: solid #c9c9c9;
    border-width: 2px 0;
    font-weight: 700;
    padding: 8px 0 7px;
    margin-bottom: 10px;
}
.project-feature-item .project-price .val{
    font-size: 2em;
    float: left;
    line-height: 1em;
}
.project-feature-item .pledged{
    float: right;
    border-left: 1px solid #999999;
    line-height: 1em;
    padding-left: 10px;
}
.project-feature-item .pledged .val-pledg{
    display: block;
    font-size: 1.38462em;
    padding: 2px 0;
}
.project-feature-item .pledged .lbl-pledg{
    font-size: 0.76923em;
    text-transform: uppercase;
    display: block;
}
.project-feature-item .project-location{
    color: #999;
}
.project-feature-item .project-location .iLocation{
    vertical-align: -3px;
    margin-right: 3px;
}


/* 10.	Header
--------------------------------------------------------------------------------*/
#header{
    background: #000000;
    position: relative;
    z-index: 10;
}
#header .header-left{
    float: left;
}
#header .header-right{
    float: right;
    padding-top: 16px;
}
#header .account-panel{
    float: right;
    margin: 4px 0 0 30px;
    padding-right: 14px;
    position: relative;
}
#header .account-panel .iUser{
    cursor: pointer;
}
#header .form-search{
    float: right;
}
#header .main-nav {
    float: left;
}
#logo{
    float: left;
    margin: 20px 36px 0 0;
    line-height: 0;
}
.btn-toogle-res-menu{
    display: none;
    cursor: pointer;
    line-height: 0;
    width: 32px;
    height: 20px;
    float: right;
    border-top: 5px solid #FFB81C;
    box-shadow: 0 5px #ffffff inset,0 10px #FFB81C inset,0 15px #ffffff inset,0 20px #FFB81C inset;
    margin: 0 20px 0 0;
}
/* Dropdown list category*/
#header .dropdown-cate{
    display: none;
    position: absolute;
    top: 100%;
    left: 0;
    cursor: default;
    padding-top: 1px;
    min-width: 480px;
}
#header .nav-item.has-sub:hover .dropdown-cate{
    display: block;
}
#header .dropdown-cate:after{
    content: "";
    position: absolute;
    top: -6px;
    left: 15px;
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 0 7px 7px 7px;
    border-color: transparent transparent #0B0711 transparent;
}
#header .dropdown-content{
    background: #000000;
    padding: 15px 17px;
}
#header .left-cate{
    float: left;
    padding: 8px 0;
    border-right: 1px solid #333333;
}
#header .lst-cate{
    float: left;
    width: 148px;
}
#header .lst-cate li{
    position: relative;
    padding: 0 4px 0 22px;
    margin-top: 9px;
}
#header .lst-cate li:first-child{
    margin-top: 0;
}
#header .lst-cate li > a{
    font-size: 1.07692em;
    color: #FFFFFF;
    transition:color 0.3s;
    -o-transition:color 0.3s;
    -ms-transition:color 0.3s;
    -moz-transition:color 0.3s;
    -webkit-transition:color 0.3s;
}
#header .lst-cate li > a:hover{
    color: #04D9D9;
    text-decoration: none;
}
#header .lst-cate li > i{
    position: absolute;
    top: 3px;
    left: 0;
    width: 10px;
    height: 10px;
    background: #04D9D9;
    border-radius: 50%;
    -moz-border-radius: 50%;
    -webkit-border-radius: 50%;
}
#header .right-cate-info{
    float: left;
    width: 145px;
    text-align: center;
    padding-top: 10px;
    padding-left: 4px;
    border-left: 1px solid #333333;
    margin-left: -1px;
}
#header .right-cate-info .cate-name{
    padding-top: 16px;
}
#header .right-cate-info .cate-name a{
    text-transform: uppercase;
    font-size: 1.23077em;
    color: #999999;
}
#header .right-cate-info .cate-desc{
    color: #999999;
    height: 55px;
    overflow: hidden;
    line-height: 1.4em;
}
#header .right-cate-info .link-count{
    color: #D8DFDF;
}
#header .right-cate-info .cate-name a:hover,
#header .right-cate-info .link-count:hover{
    color: #04D9D9;
}
/* Dropdown Login*/
#header .dropdown-login{
    display: none;
    position: absolute;
    right: 0;
    top: 41px;
    z-index: 2;
    background: #DDDDDD;
    width: 320px;
}
#header .dropdown-login:after{
    content: "";
    position: absolute;
    top: -7px;
    right: 15px;
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 0 7px 7px 7px;
    border-color: transparent transparent #DDDDDD transparent;
}
#header .login-panel{
    padding: 20px;
}
#header .dropdown-login .iClose-b{
    position: absolute;
    top: 24px;
    right: 24px;
}
#header .login-tab{}
#header .login-tab .tab-lbls{
    padding-bottom: 20px;
}
#header .login-tab .t-lbl{
    float: left;
    color: #999999;
    font-size: 1.84616em;
    border-left: 1px solid #999999;
    padding: 0 12px;
}
#header .login-tab .t-lbl:first-child{
    border-left: 0;
    padding-left: 0;
}
#header .login-tab .t-lbl.active{
    color: #000000;
}
#header .login-tab .t-lbl:hover{
    color: #555555;
    text-decoration: none;
}
#header .login-tab .tab-content-item{
    display: none;
}
#header .login-tab .tab-content-item.active{
    display: block;
}
#header .login-form .lbl-txt{
    display: block;
    padding-bottom: 14px;
}
#header .login-form .txt{
    width: 100%;
}
#header .login-form .wrap-check{
    position: relative;
    display: block;
    padding-left: 22px;
    color: #666666;
    margin-top: 3px;
}
#header .login-form .input-chk{
    position: absolute;
    top: 0;
    left: 0;
    opacity: 0;
    filter:alpha(Opacity=0);
}
#header .login-form .iUncheck2{
    position: absolute;
    top: 2px;
    left: 0;
}
#header .login-form .input-chk:checked ~ .iUncheck2{
    background-position: -223px 0;
}
#header .login-form .iUncheck2.active{/*ie8*/
    background-position: -223px 0;
}
#header .login-form .input-chk:focus ~ .iUncheck2{
    outline: 1px dotted #888;
}
#header .login-form .lost-pass{
    position: absolute;
    top: 2px;
    right: 0;
    color: #666666;
}
#header .login-form .lost-pass:hover{
    text-decoration: none;
    color: #04D9D9;
}
#header .login-form .login-authen{
    color: #666666;
    padding-top: 25px;
}
#header .login-form .login-authen .icon{
    vertical-align: -7px;
    margin-left: 2px;
}
#header .login-form .login-authen a:first-child .icon{
    margin-left: 6px;
}
#header .login-form .btn-submit{
    float: right;
    padding: 5px 21px 6px;
    background: #000000;
    color: #FFFFFF;
    border: 0;
    border-radius: 3px;
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
    transition:background 0.3s;
    -o-transition:background 0.3s;
    -ms-transition:background 0.3s;
    -moz-transition:background 0.3s;
    -webkit-transition:background 0.3s;
}
#header .login-form .btn-submit:hover{
    background: #333333;
}



/* 11.	Footer
--------------------------------------------------------------------------------*/
.mod-footer{}
.mod-footer .foot-top{
    background: #131313;
    padding: 50px 0 32px;
}
.mod-footer .foot-top a{
    color: #666666;
    font-size: 1.07692em;
    transition:color 0.3s;
    -o-transition:color 0.3s;
    -ms-transition:color 0.3s;
    -moz-transition:color 0.3s;
    -webkit-transition:color 0.3s;
}
.mod-footer .foot-top a:hover{
    text-decoration: none;
    color: #04D9D9;
}
.mod-footer .foot-block{
    line-height: 1.7em;
}
.mod-footer .foot-block .title{
    color: #04D9D9;
    font-size: 1.84615em;
    padding-bottom: 12px;
}
.mod-footer .foot-cate .col{
    float: left;
    width: 50%;
}
.mod-footer .foot-cate .col p{
    padding-top: 5px;
}
.mod-footer .foot-help{
    padding-bottom: 55px;
}
.mod-footer .site-counter{
    padding-top:25px;
}
.mod-footer .site-counter:first-child{
    padding-top: 0;
}
.mod-footer .site-counter .val{
    font-size: 2.46154em;
    color: #04D9D9;
    font-weight: 300;
}
.mod-footer .site-counter .lbl{
    font-size: 1.38462em;
    color: #999999;
    font-weight: 300;
    padding: 5px 0 0 0;
}
.mod-footer .foot-social .wrap-link{
    padding-bottom: 30px;
    padding-top: 5px;
}
.mod-footer .foot-social .wrap-link a{
    float: left;
    margin: 0 0 0 28px;
}
.mod-footer .foot-social .wrap-link a:first-child{
    margin: 0;
}
.mod-footer .footer-bottom{
    background: #000000;
    padding: 22px 0;
}
.mod-footer .foot-logo a{
    display: inline-block;
    line-height: 0;
}
.mod-footer .site-rules{
    padding-top: 10px;
    text-align: right;
}
.mod-footer .site-rules a{
    display: inline-block;
    padding-left: 8px;
    font-size: 1.07692em;
    color: #262626;
}
.mod-footer .site-rules a:hover{
    color: #04D9D9;
    text-decoration: none;
}
.mod-footer .site-rules a:before{
    content: "";
    border-left: 1px solid #262626;
    height: 12px;
    line-height: 0;
    margin-right: 8px;
    font-size: 0;
    display: inline-block;
    vertical-align: -1px;
}
.mod-footer .site-rules a:first-child:before{
    display: none;
}


/* 12.	Module's style: module slide
--------------------------------------------------------------------------------*/
.mod-slide{
    position: relative;
}
.mod-slide .img-slide{
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: transparent no-repeat top center;
}
.mod-slide .slide-content{
    position: relative;
    height: 434px;
}
.mod-slide .txt-desc{
    padding-top: 98px;
    text-align: right;
}
.mod-slide .desc-tit{
    font-size: 3.0769em;
    line-height: 1.2em;
    padding: 11px 17px;
    color: #FFFFFF;
    background: #090605;
    text-transform: uppercase;
    display: inline-block;
}
.mod-slide .desc-intro{
    font-size: 1.0769em;
    line-height: 1.2em;
    padding: 8px 20px;
    color: #FFFFFF;
    background: #090605;
    display: inline-block;
}
.mod-slide .slide-pagination{
    text-align: center;
    clear: both;
    position: absolute;
    width: 100%;
    left: 0;
    bottom: 0;
    padding: 0 0 20px 0;
}
.mod-slide .slide-pagination i{
    cursor: pointer;
    margin-left: 17px;
    /*border: 5px solid transparent;*/
    display: inline-block;
    background: #FFFFFF;
    width: 10px;
    height: 10px;
    position: relative;
    border-radius: 50%;
    -moz-border-radius: 50%;
    -webkit-border-radius: 50%;
}
.mod-slide .slide-pagination i:first-child{
    margin-left: 0;
}
.mod-slide .slide-pagination i:hover{
    background: #04D9D9;
}
.mod-slide .slide-pagination i:after{
    content: "";
    background: #04D9D9;
    position: absolute;
    left: 5px;
    top: 5px;
    width: 0;
    height: 0;
    border-radius: 50%;
    -moz-border-radius: 50%;
    -webkit-border-radius: 50%;
    transition:all 0.3s;
    -o-transition:all 0.3s;
    -ms-transition:all 0.3s;
    -moz-transition:all 0.3s;
    -webkit-transition:all 0.3s;

}
.mod-slide .slide-pagination i.active:after{
    width: 16px;
    height: 16px;
    left: -3px;
    top: -3px;
}


/* 12.	Module's style: module use guide
--------------------------------------------------------------------------------*/
.mod-use-guide{}
.mod-use-guide .guide-steps{
    padding: 31px 0 23px;
    background: #000000;
    color: #FFFFFF;
    text-align: center;
}
.mod-use-guide .desc-step{
    text-align: left;
    display: inline-block;
}
.mod-use-guide .step-num{
    font-size: 3.8462em;
    line-height: 1em;
    color: #04D9D9;
    float: left;
    font-weight: 700;
}
.mod-use-guide .m-space-num{
    padding: 7px 0 0 7px;
    float: left;
}
.mod-use-guide .m-space-num a{
    color: #FFFFFF;
    font-size: 1.0769em;
    line-height: 1em;
    font-weight: 700;
    text-transform: uppercase;
}
.mod-use-guide .m-space-num a:hover{
    text-decoration: none;
    color: #04D9D9;
}
.mod-use-guide .desc-text{
    font-weight: 300;
    font-size: 0.9231em;
    line-height: 1.2em;
}
.mod-use-guide .sep{
    vertical-align: 8px;
    margin: 0 40px;
}
.mod-use-guide .sep:first-child{
    display: none;
}


/* 12.	Module's style: module carousel project
--------------------------------------------------------------------------------*/
.mod-carousel-project{
    padding: 60px 0;
}
.mod-carousel-project.odd{
    background: url("../images/bg-gray.png");
}
.mod-carousel-project .wrap-title{
    position: relative;
}
.mod-carousel-project .title{
    padding: 0 0 30px 0;
    margin: 0;
    font-size: 2.4615em;
    font-weight: 700;
    color: #262626;
}
.mod-carousel-project .wrap-title .view-all{
    text-transform: uppercase;
    position: absolute;
    top: 20px;
    right: 0;
    color: #666666;
    text-decoration: underline;
}
.mod-carousel-project .wrap-title .view-all:hover{
    color: #04D9D9;
}
.mod-carousel-project .wrap-carousel{
    position: relative;
}
.mod-carousel-project .wrap-carousel .btn-nav{
    position: absolute;
    top: 40%;
    z-index: 5;
    background: #999999;
    width: 50px;
    height: 60px;
    cursor: pointer;
    transition:background 0.3s;
    -o-transition:background 0.3s;
    -ms-transition:background 0.3s;
    -moz-transition:background 0.3s;
    -webkit-transition:background 0.3s;
}
.mod-carousel-project .btn-nav:hover{
    background: #000000;
}
.mod-carousel-project .btn-nav.prev{
    left: 0;
    border-radius: 0 6px 6px 0;
    -moz-border-radius: 0 6px 6px 0;
    -webkitborder-radius: 0 6px 6px 0;
}
.mod-carousel-project .btn-nav.next{
    right: 0;
    border-radius: 6px 0 0 6px;
    -moz-border-radius: 6px 0 0 6px;
    -webkitborder-radius: 6px 0 0 6px;
}
.mod-carousel-project .btn-nav .iArrowPrev-2{
    position: absolute;
    top: 19px;
    left: 19px;
}
.mod-carousel-project .btn-nav:hover .iArrowPrev-2{
    background-position: -41px -47px;
}
.mod-carousel-project .btn-nav .iArrowNext-2{
    position: absolute;
    top: 19px;
    right: 19px;
}
.mod-carousel-project .btn-nav:hover .iArrowNext-2{
    background-position: -53px -47px;
}
.mod-carousel-project .owl-wrapper-outer:before,
.mod-carousel-project .owl-wrapper-outer:after{
    content: "";
    position: absolute;
    top: 0;
    left: 100%;
    width: 200px;
    height: 100%;
    margin-left: -1.25%;
    background: #ffffff;
    z-index: 1;
}
.mod-carousel-project .owl-wrapper-outer:after{
    left: auto;
    right: 100%;
    margin-right: -1.25%;
    margin-left:0;
}
.mod-carousel-project.odd .owl-wrapper-outer:before,
.mod-carousel-project.odd .owl-wrapper-outer:after{
    background: url("../images/bg-gray.png");
}


/* 12.	Module's style: module update project
--------------------------------------------------------------------------------*/
.mod-update-project{
    padding: 60px 0 50px;
}


/* 12.	Module's style: module discover
--------------------------------------------------------------------------------*/
.mod-discover{
    margin-bottom: 100px;
}
.mod-discover .over-content{
    text-align: center;
    background: url("../images/green-trans.png");
    min-height: 316px;
    color: #0B2C3C;
}
.mod-discover .grid_9{
    float: none;
    display: block;
    margin: 0 auto;
}
.mod-discover .wrap-txt{
    display: table;
    width: 100%;
    table-layout: fixed;
}
.mod-discover .center-txt{
    width: 100%;
    height: 316px;
    display: table-cell;
    text-align: center;
    vertical-align: middle;
}
.mod-discover .head-line{
    padding: 10px 0;
    font-weight: 700;
    font-size: 3.69231em;
}
.mod-discover .desc{
    font-size: 1.38462em;
    line-height: 1.4em;
    padding-bottom: 20px;
}
.mod-discover .btn-link{
    display: inline-block;
    padding: 15px 0;
    color: #000000;
    width: 190px;
    font-size: 1.23077em;
    background: #ffffff;
    border-radius: 0 5px 5px 0;
    -moz-border-radius: 0 5px 5px 0;
    -webkit-border-radius: 0 5px 5px 0;
    transition: color 0.3s,background 0.3s;
    -o-transition: color 0.3s,background 0.3s;
    -ms-transition: color 0.3s,background 0.3s;
    -moz-transition: color 0.3s,background 0.3s;
    -webkit-transition: color 0.3s,background 0.3s;
}
.mod-discover .btn-link:first-child{
    border-right: 1px solid #0B2C3C;
    border-radius: 5px 0 0 5px;
    -moz-border-radius: 5px 0 0 5px;
    -webkit-border-radius: 5px 0 0 5px;
}
.mod-discover .btn-link:hover{
    text-decoration: none;
    color: #04D9D9;
    background: #0B2C3C;
}


/* 12.	Module's style: module partner
--------------------------------------------------------------------------------*/
.mod-partner{
    padding-bottom: 105px;
}
.mod-partner .partner-item{
    padding: 0 55px;
    text-align: center;
    box-sizing: border-box;
    color: #444444;
    font-size: 1.07692em;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
}
.mod-partner .logo-partner{
    min-height: 36px;
    line-height: 36px;
}
.mod-partner .p-quote:before{
    content: "";
    display: block;
    width: 84px;
    border-bottom: 1px solid #555555;
    margin: 16px auto;
}

/* 12.	Module's style: module feature of cate
--------------------------------------------------------------------------------*/
.mod-feature-of-cate{
    overflow: hidden;
    padding: 45px 0 80px;
}
.mod-feature-of-cate .block-content .grid_10{
    margin-left: 0;
    width: 82.08333333333333%;
}
.mod-feature-of-cate .viewport{
    overflow: hidden;
    position: relative;
    height: 321px;
    padding-left: 1.54639%;
}
.mod-feature-of-cate .viewport .overview{
    position: absolute;
    top: 0;
    left: 1.54639%;
}
.mod-feature-of-cate .project-feature-item{
    height: 321px;
}
.mod-feature-of-cate .viewport .tmp-loading{
    position: absolute;
    width:  100%;
    height: 100%;
    top: 0;
    left: 0;
    text-align: center;
    line-height: 320px;
    background: #EEEEEE;
}
.mod-feature-of-cate .lst-cate{
    position: relative;
}
.mod-feature-of-cate .lst-cate:before{
    content: "";
    position: absolute;
    top: -5000px;
    left: 0;
    height: 100000px;
    border-left: 1px solid #999;
}
.mod-feature-of-cate .lst-cate a{
    font-size: 1.07692em;
    color: #262626;
}
.mod-feature-of-cate .lst-cate a:hover{
    text-decoration: none;
    color: #04D9D9;
}
.mod-feature-of-cate .lst-cate li{
    padding: 2px 0 2px 26px;
    margin-bottom: 4px;
    position: relative;
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
}
.mod-feature-of-cate .lst-cate li.mark{
    content: "";
    padding: 0;
    margin: 0;
    position: absolute;
    top: 0;
    left: 0;
    height: 24px;
    width: 6px;
    background: #04D9D9;
    transition:top 0.3s;
    -o-transition:top 0.3s;
    -ms-transition:top 0.3s;
    -moz-transition:top 0.3s;
    -webkit-transition:top 0.3s;
}
.mod-feature-of-cate .nav-slide{
    padding-left: 1.54639%;
    padding-top: 20px ;
}
.mod-feature-of-cate .grp-btn-nav{
    float: left;
}
.mod-feature-of-cate .grp-btn-nav a{
    display: inline-block;
    margin-right: 10px;
    float: left;
    background: #cdcdcd;
    width: 24px;
    height: 24px;
    line-height: 28px;
    border-radius: 3px;
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
}
.mod-feature-of-cate .grp-btn-nav a i{
    margin-left: 9px;
}
.mod-feature-of-cate .lst-link-cate{
    padding-top: 3px;
    float: left;
}
.mod-feature-of-cate .lst-link-cate a{
    display: none;
    color: #666666;
    text-decoration: underline;
    text-transform: uppercase;
}
.mod-feature-of-cate .lst-link-cate a.active{
    display: inline-block;
}
.mod-feature-of-cate .lst-link-cate a:hover{
    color: #04D9D9;
}


/* 12.	Module's style: module browse cate
--------------------------------------------------------------------------------*/
.mod-browse-cate{
    height: 320px;
    background: center center;
    position: relative;
}
.mod-browse-cate:before{
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: url("../images/bg-overlay-dot-trans.png");
    opacity: 0.5;
}
.mod-browse-cate > *{
    position: relative;
}
.mod-browse-cate .title{
    font-weight: 700;
    font-size: 2.46154em;
    color: #FFFFFF;
    margin: 0;
    padding: 45px 0 4px;
}
.mod-browse-cate .tit-desc{
    color: #fff;
    font-size: 1.230769230769231em;
    padding-bottom: 20px;
}
.mod-browse-cate .list-cate > a{
    margin-left: 7px;
    margin-bottom: 20px;
    transition:opacity 0.3s;
    -o-transition:opacity 0.3s;
    -ms-transition:opacity 0.3s;
    -moz-transition:opacity 0.3s;
    -webkit-transition:opacity 0.3s;
}
.mod-browse-cate .list-cate > a:first-child{
    margin-left: 0;
}
.mod-browse-cate .list-cate > a:hover{
    opacity: 0.9;
    filter:alpha(Opacity=90);
}


/* 12.	Module's style: module group filter
--------------------------------------------------------------------------------*/
.mod-grp-filter{
    border: solid #CCCCCC;
    border-width: 1px 0;
}


/* 12.	Module's style: module xxxx
--------------------------------------------------------------------------------*/


/* 13.	Page's style: Page xxxx
--------------------------------------------------------------------------------*/
















